<script setup lang="ts">
import { getJueSeWeiHuApi } from '@/api/system'
import { ElMessage } from 'element-plus'
import { onMounted } from 'vue'
import { ref } from 'vue'
import sortSetUp from './sortSetUp.vue'

const props = defineProps<{
  isShow: boolean
  formInfo: any
}>()
const emit = defineEmits<{
  (e: 'update:isShow', value: boolean): void
}>()
const indexMethod = (index: number) => index + 1
const loading = ref(true)
const tableData = ref([])
const getList = async () => {
  loading.value = true
  tableData.value = []
  const params = {
    sqlId: 'dimMgr.dimSort',
    sqlParam: JSON.stringify({
      ...props.formInfo
    })
  }
  await getJueSeWeiHuApi(params)
    .then((res: any) => {
      tableData.value = res.rows
      loading.value = false
    })
    .catch(() => {
      ElMessage({ message: '数据请求失败', type: 'error' })
    })
}

const ssuShow = ref(false)
const ssuFormInfo = ref({})
const changeBtn = (row: any) => {
  // console.log(props.formInfo)
  // console.log(row)
  ssuFormInfo.value = {
    dimId: props.formInfo.dimId,
    propCol: props.formInfo.propCol,
    prop_key: row.prop_key,
    prop_column: row.prop_column
  }
  ssuShow.value = true
}
// 取消
const Cancel = () => {
  emit('update:isShow', false)
}

onMounted(() => {
  getList()
})
</script>
<template>
  <div class="attributeMaintenanceBox">
    <el-dialog class="dialogBox" :model-value="true" title="属性值排序设置" @close="Cancel()">
      <el-table
        v-loading="loading"
        :data="tableData"
        border
        style="width: 100%"
        class="baobiaoTableBox"
      >
        <el-table-column type="index" :index="indexMethod" align="center" width="50" />
        <el-table-column prop="prop_column" label="属性值" align="center" />
        <el-table-column prop="val_order" label="排序" align="center" />
        <el-table-column label="操作" width="100" align="center">
          <template #default="scope">
            <el-button text type="primary" @click="changeBtn(scope.row)">修改</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-dialog>
  </div>
  <sortSetUp
    v-if="ssuShow"
    v-model:is-show="ssuShow"
    :form-info="ssuFormInfo"
    @get-list="getList"
  />
</template>
<style scoped lang="less">
.attributeMaintenanceBox {
  :deep(.el-dialog__body) {
    height: 70vh;
    overflow-y: scroll;
  }
}
</style>
